<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <!-- SEO  -->
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <!-- 苹果专用 -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="blank" />
    <meta name="format-detection" content="telephone=no" />
    <!-- 简单移动端适配 -->
   	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <!-- 图标 -->
	<link rel="shortcut icon" href="">

    <title>个人简历</title>

    <link rel="stylesheet" type="text/css" href="swiper/css/swiper-3.3.1.min.css"/>
    <link rel="stylesheet" href="swiper/css/animate.min.css" />
    <link rel="stylesheet" href="css/index.css" />

    <script src="js/jquery-2.1.0.js"></script>

    <script type="text/javascript">

   		document.addEventListener('plusready', function(){
   			//console.log("所有plus api都应该在此事件发生后调用，否则会出现plus is undefined。"

   		});

    </script>
</head>

<body>
	<div class="swiper-container">
	    <div class="swiper-wrapper">
	        <div class="swiper-slide home">
	        	<span class="ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0.1s"><img src="img/H.png" alt="H" /></span>
	        	<span class="ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0.2s"><img src="img/T.png" alt="T" /></span>
	        	<span class="ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0.3s"><img src="img/M.png" alt="M" /></span>
	        	<span class="ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0.4s"><img src="img/L.png" alt="L" /></span>
	        	<span class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.6s"><img src="img/5.png" alt="5" /></span>
	        	<span class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.7s"><img src="img/shield.png" alt="盾" /></span>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide personal">

	        	<span class="ani" swiper-animate-effect="fadeInRightBig" swiper-animate-duration="1s" swiper-animate-delay="0s">求</span>
	        	<span class="ani" swiper-animate-effect="fadeInRightBig" swiper-animate-duration="1s" swiper-animate-delay=".1s">职</span>
	        	<span class="ani" swiper-animate-effect="fadeInRightBig" swiper-animate-duration="1s" swiper-animate-delay=".2s">简</span>
	        	<span class="ani" swiper-animate-effect="fadeInRightBig" swiper-animate-duration="1s" swiper-animate-delay=".3s">历</span>

	        	<div class="ani" swiper-animate-effect="bounceIn" swiper-animate-duration="1s" swiper-animate-delay=".4s">贤臣择主而事</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide directory">
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="0s">目录</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay=".2s">目录</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay=".4s">个人信息</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay=".6s">求职意向</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay=".8s">工作经历</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="1s">自我评价</div>
	        	<div class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="1.2s">作品展示</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide information">
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay="0s">个人信息</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay=".2s">
	        		<span>姓名:</span><span>苗壮</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay=".4s">
	        		<span>性别:</span><span>男</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay=".6s">
	        		<span>年龄:</span><span>23</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay=".8s">
	        		<span>学历:</span><span>本科</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay="1s">
	        		<span>专业:</span><span>通信工程</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay="1.2s">
	        		<span>电话:</span><span>15538079130</span>
	        	</div>
	        	<div class="ani" swiper-animate-effect="zoomInLeft" swiper-animate-duration="1s" swiper-animate-delay="1.4s">
	        		<span>邮箱:</span><span>731630501@qq.com</span>
	        	</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide objective">
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0s">求职意向</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay=".8s">web前端工程师</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide experience">
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0s">工作经历</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay=".4s">1,北京某某公司, web前端工程师</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay=".8s">2,北京某某公司, web前端工程师</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="1.2s">3,北京某某公司, web前端工程师</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide assessment">
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0s">自我评价</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay=".8s">热心,爽朗,有针对性的技术攻关</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	        <div class="swiper-slide display">
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0s">作品展示</div>
	        	<div class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay=".8s">
	        		暂无
	        	</div>
	        	<b class="move"><img src="img/load.png" alt="" /></b>
	        </div>
	    </div>
	    <div id="music">
	    	<!--音乐播放背景-->
	    </div>

	</div>


	<script src="swiper/js/swiper-3.4.0.jquery.min.js"></script>
    <script src="swiper/js/swiper-3.3.1.min.js"></script>
    <script src="swiper/js/swiper.animate.min.js"></script>
	<script>
		var mySwiper = new Swiper ('.swiper-container', {
		    direction: 'vertical',

		    onInit: function(swiper) { //Swiper2.x的初始化是onFirstInit
				swiperAnimateCache(swiper); //隐藏动画元素
				swiperAnimate(swiper); //初始化完成开始动画
			},
			onSlideChangeEnd: function(swiper) {
				swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
			}

		})

		setInterval(function(){
			$(".move").animate({
				marginTop: '4.3rem'
			}).animate({
				marginTop: '4.5rem'
			})
		},300)
	</script>
</body>

</html>
